<h2 class="divider">Statistics</h2>

<div class="loading">
  <div class="icon">
    <span class="progress-icon"></span>
  </div>
  <div class="notice">
    Please wait while we load up your backlog statistics.
  </div>
</div>

<div class="stats">
  <div class="burn-down">
    <div id="burn-down-chart" class="chart has-options"></div>
    <div class="options">
      <input type="checkbox" id="show-projected"><label for="show-projected">Show projected based on average velocity</label>
    </div>
  </div>

  <div class="burn-up">
    <div id="burn-up-chart" class="chart has-options"></div>
    <div class="options"></div>
  </div>

  <div class="velocity">
    <div id="velocity-chart" class="chart"></div>
  </div>

  <div class="average">
    <h3>Velocity</h3>
    <div class="box">
      <table class="comparison">
        <tr>
          <th class="empty"></th>
          <th>Average</th>
          <th>Expected</th>
        </tr>
        <tr class="per-day">
          <td>Velocity per day</td>
          <td id="velocity-per-day-average"></td>
          <td id="velocity-per-day-expected"></td>
        </tr>
        <tr>
          <td>Velocity per sprint</td>
          <td id="velocity-per-sprint-average"></td>
          <td id="velocity-per-sprint-expected"></td>
        </tr>
      </table>

      <div class="notice"></div>
    </div>
  </div>
</div>

<div class="no-stats">
  <p>Unfortunately you have not yet completed a sprint, so there are no statistics available yet.</p>
  <p>Once you have marked your first sprint as complete, statistics will appear in this area</p>
  <div class="stats-placeholder"><div></div></div>
</div>

<div class="no-points">
  <p>Unfortunately your backlog has not been assigned any points and as such there are no statistics available yet.</p>
  <p>Once your backlog stories have been assigned points, statistics will appear in this area.</p>
  <div class="stats-placeholder"><div></div></div>
</div>